<template>
  <div class="animate-fadeIn">
    <div class="mb-6">
      <h2 class="text-2xl font-bold cyber-text mb-2">绑定测试用例</h2>
      <p class="text-gray-400">将测试用例绑定到测试任务</p>
    </div>
    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
      <!-- 可用测试用例 -->
      <div class="glass-effect rounded-xl p-6 tech-card">
        <h3 class="text-lg font-bold cyber-text mb-4 flex items-center">
          <i class="fas fa-list mr-2"></i>可用测试用例
        </h3>
        <div class="space-y-3 max-h-96 overflow-y-auto">
          <div class="flex items-center justify-between p-3 bg-gray-800/30 rounded-lg border border-gray-600 hover:border-tech-blue transition-colors">
            <div>
              <h4 class="text-white font-medium">登录功能测试</h4>
              <p class="text-gray-400 text-sm">验证用户登录流程</p>
            </div>
            <button class="cyber-button px-3 py-1 text-xs text-white rounded">绑定</button>
          </div>
        </div>
      </div>
      
      <!-- 已绑定测试用例 -->
      <div class="glass-effect rounded-xl p-6 tech-card">
        <h3 class="text-lg font-bold cyber-text mb-4 flex items-center">
          <i class="fas fa-link mr-2"></i>已绑定测试用例
        </h3>
        <div class="space-y-3 max-h-96 overflow-y-auto">
          <div class="flex items-center justify-between p-3 bg-green-900/20 rounded-lg border border-green-500/30">
            <div>
              <h4 class="text-white font-medium">UI界面测试</h4>
              <p class="text-green-400 text-sm">已绑定到任务#001</p>
            </div>
            <button class="px-3 py-1 text-xs text-red-400 border border-red-400 rounded hover:bg-red-400 hover:text-white transition-colors">
              解绑
            </button>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
// 绑定测试用例页面
</script>

